<template>
  <div class="scheme_header">
    <div class="breadcrumb">
      <router-link to="/fangan" class="tohome">方案 </router-link>&nbsp;/&nbsp;
      <!-- <router-link to="/filter" class="tofilter"> 过滤器</router-link>&nbsp;/ -->
      <!-- <div>主页 / 过滤器 /</div> -->
      <div class="active_breadcrumb">{{ state.openname }}</div>
    </div>

    <div class="scheme_form">
      <el-form inline v-if="state.schemOptions.scheme_name != null" label-width="98px">
        <el-form-item label="单边方案名称：" style="width: 100%">
          <el-input v-model="state.schemOptions.scheme_name" style="width: 600px; height: 32px" />
        </el-form-item>
        <el-form-item label="关联过滤器：" style="width: 100%">
          <el-select
            v-model="state.schemOptions.filter_obj_code"
            placeholder="关联过滤器"
            style="width: 600px; height: 32px"
          >
            <!-- <el-option label="无过滤器" value="none" /> -->
            <el-option
              v-for="item in state.filterlist"
              :key="item.filter_obj_code"
              :label="item.filter_name"
              :value="item.filter_obj_code"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="选择平台：" style="width: 100%">
          <el-select
            v-model="state.schemOptions.bc_type"
            placeholder="平台"
            multiple
            :max-collapse-tags="4"
            collapse-tags
            style="width: 600px; height: 32px"
          >
            <el-option
              v-for="item in state.bctypes"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script setup>
const { store, state } = inject('Scheme')
</script>

<style lang="scss" scoped>
.scheme_header {
  width: 100%;
  height: 220px;
  border-bottom: 1px solid #ebebeb;
  padding: 16px 24px 0 24px;

  .breadcrumb {
    display: flex;
    font-size: 14px;
    color: #8a8a8a;
    height: 24px;
    align-items: flex-end;

    .active_breadcrumb {
      font-size: 20px;
      font-weight: 600;
      color: #333;
      margin-left: 4px;
    }
  }
}
.scheme_form {
  margin-top: 16px;
}
.tohome,
.tofilter {
  font-size: 14px;
  text-decoration: none;
  color: #8a8a8a;
}
</style>

<style>
.scheme_form .el-form-item__label {
  font-size: 14px;
  justify-content: center;
  color: #333;
  padding: 0;
}
.scheme_form .el-input__inner {
  height: 32px;
}
.scheme_form .el-form-item {
  margin-bottom: 16px;
}
</style>